<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Upload your DAS sources</title>
</head>
<body>
<form action="creator" method="post" enctype="multipart/form-data" target="result">
	<!--hello world Organism : <input type="text" name="organism"> -->
<table>
	<tbody>
	    <tr><td><h2>Define your DAS sources</h2><td><tr>
	    <tr><td>&nbsp;<td><tr>
		<tr>
			<td>
			<table border="0">
				<tbody>
					<tr>
						<td valign="top" nowrap align="right">&nbsp;&nbsp;</td>
						<td align="left" valign="top">
						<table width="100" border="0">
							<tr>
								<td id="tdFileInputs" width="100" valign="top"></td>
							</tr>
							<tr>
								<td nowrap="nowrap"><a id="lnkFile"
									onmouseover="this.style.textDecoration='underline'"
									onmouseout="this.style.textDecoration='none'"
									style="cursor: hand" onclick="AddFileInput()">Attach a DAS source</a>
							</tr>
						</table>
						</td>
						<td style="width: 3px" nowrap align="right"></td>
					</tr>
					<tr>
						<td colspan="3">
						<hr>
						</td>
					</tr>
					<tr>
						<td valign="top" colspan="3" align="right"><input
							id="btnSend" type="submit" value="Submit"></td>
					</tr>
				</tbody>
			</table>
			</td>
		</tr>
		<tr>
			<td align="left"></td>
		</tr>
	</tbody>
</table>
</form>
</body>
</html>

<script language="javascript" type="text/javascript">
		var id = 0;
		var files = 0;	
		var texts = 0;	
		
		function AddFileInput()
		{
			var tdFileInputs = document.getElementById("tdFileInputs");
			//var id = files; // (new Date()).getTime();
			var table = document.createElement("table");
			table.setAttribute('id',id);
			table.setAttribute("border", "0");
			table.setAttribute("cellspacing", "0");
			table.setAttribute("cellpadding", "0");
			
			// Das source title
			var titleRow = document.createElement("tr");
			var titleCol = document.createElement("td");
			titleCol.setAttribute("colspan", "3");
			var titleB = document.createElement("b");
			titleB.appendChild(document.createTextNode("Das source "));
			titleCol.appendChild(titleB);
			titleRow.appendChild(titleCol);
			table.appendChild(titleRow);
	
			// Name
			var nameRow = document.createElement("tr");
			var nameCol1 = document.createElement("td");
			var nameCol2 = document.createElement("td");
			var nameCol3 = document.createElement("td");
			nameCol1.appendChild(document.createTextNode("Name "));
			nameCol2.appendChild(document.createTextNode(" "));
			var nameInput = document.createElement('input');
            nameInput.setAttribute('id', "name_" + id);
            nameInput.setAttribute('type','text');
            nameInput.setAttribute('name', "name_" + id);	
			nameCol3.appendChild(nameInput);
			nameRow.appendChild(nameCol1);
			nameRow.appendChild(nameCol2);
			nameRow.appendChild(nameCol3);
			table.appendChild(nameRow);
			
			// Description
			var descrRow = document.createElement("tr");
			var descrCol1 = document.createElement("td");
			var descrCol2 = document.createElement("td");
			var descrCol3 = document.createElement("td");
			descrCol1.appendChild(document.createTextNode("Description "));
			descrCol2.appendChild(document.createTextNode(" "));
			var descrInput = document.createElement('input');
            descrInput.setAttribute('id', "descr_" + id);
            descrInput.setAttribute('type','text');
            descrInput.setAttribute('name', "descr_" + id);	
			descrCol3.appendChild(descrInput);
			descrRow.appendChild(descrCol1);
			descrRow.appendChild(descrCol2);
			descrRow.appendChild(descrCol3);
			table.appendChild(descrRow);

			// label
			var labelRow = document.createElement("tr");
			var labelCol1 = document.createElement("td");
			var labelCol2 = document.createElement("td");
			var labelCol3 = document.createElement("td");
			labelCol1.appendChild(document.createTextNode("Label "));
			labelCol2.appendChild(document.createTextNode(" "));
			var labelInput = document.createElement('input');
            labelInput.setAttribute('id', "label_" + id);
            labelInput.setAttribute('type','text');
            labelInput.setAttribute('name', "label_" + id);	
			labelCol3.appendChild(labelInput);
			labelRow.appendChild(labelCol1);
			labelRow.appendChild(labelCol2);
			labelRow.appendChild(labelCol3);
			table.appendChild(labelRow);

			// specie
			var specieRow = document.createElement("tr");
			var specieCol1 = document.createElement("td");
			var specieCol2 = document.createElement("td");
			var specieCol3 = document.createElement("td");
			specieCol1.appendChild(document.createTextNode("Specie "));
			specieCol2.appendChild(document.createTextNode(" "));

			var specieSelect = document.createElement('select');
            specieSelect.setAttribute('id', "specie_" + id);
            specieSelect.setAttribute('name', "specie_" + id);

            var specieOption = document.createElement('option');
			specieOption.text = "Homo sapiens"; 
			specieOption.value = "hs";
   			specieSelect.appendChild(specieOption);

			var specieOption2 = document.createElement('option');
 			specieOption2.text = "Rattus norvegicus"; 
			specieOption2.value = "rn";
   			specieSelect.appendChild(specieOption2);

   			var specieOption3 = document.createElement('option');
 			specieOption3.text = "Mus musculus"; 
			specieOption3.value = "mm";
   			specieSelect.appendChild(specieOption3);

   			var specieOption4 = document.createElement('option');
 			specieOption4.text = "Pan troglodytes"; 
			specieOption4.value = "pt";
   			specieSelect.appendChild(specieOption4);
   			
			specieCol3.appendChild(specieSelect);
			specieRow.appendChild(specieCol1);
			specieRow.appendChild(specieCol2);
			specieRow.appendChild(specieCol3);
			table.appendChild(specieRow);

			// file
			var fileRow = document.createElement("tr");
			var fileCol1 = document.createElement("td");
			var fileCol2 = document.createElement("td");
			var fileCol3 = document.createElement("td");
			var fileNobr = document.createElement("nobr");
			fileNobr.appendChild(document.createTextNode("Annotation file "));
			fileCol1.appendChild(fileNobr);
			fileCol2.appendChild(document.createTextNode(" "));
			var fileInput = document.createElement('input');
            fileInput.setAttribute('id', "file_" + id);
            fileInput.setAttribute('type','file');
            fileInput.setAttribute('name', "file_" + id);	
			fileCol3.appendChild(fileInput);
			fileRow.appendChild(fileCol1);
			fileRow.appendChild(fileCol2);
			fileRow.appendChild(fileCol3);
			table.appendChild(fileRow);
		
			// remove
            var a = document.createElement('a');
            a.setAttribute('id','remove_' + id);
            a.innerHTML = "Remove";
			a.onclick = RemoveFileInput;
			var removeRow = document.createElement("tr");
			var removeCol = document.createElement("td");
			removeCol.setAttribute("colspan", "3");
			removeCol.appendChild(a);
			removeRow.appendChild(removeCol);
			table.appendChild(removeRow);

			// space
			var spaceRow = document.createElement("tr");
			var spaceCol = document.createElement("td");
			spaceCol.setAttribute("colspan", "3");
			spaceCol.appendChild(document.createElement("hr"));
			spaceRow.appendChild(spaceCol);
			table.appendChild(spaceRow);

			tdFileInputs.appendChild(table);
			
			var lnkFile = document.getElementById('lnkFile');
			files = files + 1;
			if(files>0)
			{
			    lnkFile.innerHTML = "Attach another DAS source";
			    document.getElementById("btnSend").style.display="";
			}
			else
			{
			    document.getElementById("btnSend").style.display="none";
			    lnkFile.innerHTML = "Attach a DAS source";
			}
			id = id + 1;
		}
		
		function RemoveFileInput(e)
		{
		    var Event = e ? e : window.event; 
		    var obj = Event.target ? Event.target : window.event.srcElement; 
			var tdFileInputs = document.getElementById('tdFileInputs');
			var a = document.getElementById(obj.id);
			//tdFileInputs.removeChild(a);
			var fileInputId = obj.id.replace('remove_','');
			var fileInput = document.getElementById(fileInputId);
			tdFileInputs.removeChild(fileInput);
			var lnkFile = document.getElementById('lnkFile');
			files = files - 1;
			if(files>0)
			{
			    lnkFile.innerHTML = "Attach another DAS source";
			    //document.getElementById("btnSend").style.display="";
			}
			else
			{
			    lnkFile.innerHTML = "Attach a DAS source";
			    //document.getElementById("btnSend").style.display="none";
			}
		}
	
		function AddTextInput()
		{		    	
			var tdTextInputs = document.getElementById('tdTextInputs');
			var id = (new Date()).getTime();
			var nobr = document.createElement('nobr');
			nobr.setAttribute('id',id);
			var text = document.createElement('input');
            //text.setAttribute('id',id);
            text.setAttribute('type','text');
            text.setAttribute('name',id);
            nobr.appendChild(text);
            //tdTextInputs.appendChild(text);
			var check = document.createElement('input');
			check.setAttribute('type', 'checkbox');
			check.setAttribute('name', 'chk_' + id);
			nobr.appendChild(check);
			var label = document.createTextNode("Score   ");
			//tdTextInputs.appendChild(label);
			nobr.appendChild(label);
			tdTextInputs.appendChild(nobr);
			//tdTextInputs.appendChild(document.createElement('br'));
			var a = document.createElement('a');
            a.setAttribute('id','remove_' + id);
            a.innerHTML = "Remove";
			a.onclick = RemoveTextInput;
			tdTextInputs.appendChild(a);
			var lnkText = document.getElementById('lnkText');
			texts = texts + 1;
			if(texts>0)
			{
			    lnkText.innerHTML = "Add another DAS source";
			    //document.getElementById("btnSend").style.display="";
			}
			else
			{
			    //document.getElementById("btnSend").style.display="none";
			    lnkText.innerHTML = "Add a DAS source";
			}
		}
		
		function RemoveTextInput(e)
		{
		    var Event = e ? e : window.event; 
		    var obj = Event.target ? Event.target : window.event.srcElement; 
			var tdTextInputs = document.getElementById('tdTextInputs');
			var a = document.getElementById(obj.id);
			tdTextInputs.removeChild(a);
			var textInputId = obj.id.replace('remove_','');
			var textInput = document.getElementById(textInputId);
			tdTextInputs.removeChild(textInput);
			var lnkText = document.getElementById('lnkText');
			texts = texts - 1;
			if(texts>0)
			{
			    lnkText.innerHTML = "Add another DAS source";
			    //document.getElementById("btnSend").style.display="";
			}
			else
			{
			    lnkText.innerHTML = "Add a DAS source";
			    //document.getElementById("btnSend").style.display="none";
			}
		}
		
</script>


